<template>
  <div class="vue-ueditor">
    <vue-ueditor-wrap
      v-model="content"
      :config="config"
      @ready="ready"
      :destroy="destroy">
    </vue-ueditor-wrap>
  </div>
</template>

<script>
import VueUeditorWrap from 'vue-ueditor-wrap'
export default {
  props: {
    destroy: {
      type: Boolean,
      default: true
    },
    config: {
      type: Object,
      default() {
        return {
          autoHeightEnabled: false,
          initialFrameHeight: 450,
          initialFrameWidth: '100%',
          zIndex: 5000,
          enableAutoSave: true,
          serverUrl: ''
        }
      }
    },
  },
  created () {
    // console.log('config', this.config)
  },
  data() {
    return {
      content: '',
      uEditor: null
    }
  },
  components: {
    VueUeditorWrap
  },
  methods: {
    ready(editorInstance) {
      this.uEditor = editorInstance
      this.$emit('ready', editorInstance)
    },
    getContent() {
      // console.log('uEditor', this.uEditor)
    }
  },
  watch: {
    content(newValue) {
      this.$emit('content', newValue)
    }
  }
}
</script>